import React, { useEffect, useState } from "react";

const UseEffectComponent = () => {
    const [count, setCount] = useState(0)

    const [count1, setCount1] = useState(10)

    useEffect(() => {
        console.log('组件初始化')
        return () => {
            console.log('组件被卸载')
        }
    }, [])

    useEffect(() => {
        console.log('count 变化了')
    }, [count])

    useEffect(() => {
        console.log('count1 变化了')
    }, [count1])

    useEffect(() => {
        console.log('我每次都执行')
    })

    return (
        <div>
            <h1>useEffect</h1>
            <p>{count}</p>
            <button onClick={() => setCount(count + 1)}>计数1</button>
            <p>{count1}</p>
            <button onClick={() => setCount1(count1 + 10)}>计数1</button>
        </div>
    )
}

export default UseEffectComponent